.player-tag {
  padding: 6px 12px;
  border-radius: 15px;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
}

.player-tag[data-role="squadleader"]::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232c3e50"><path d="M12 2L4 5v6.09c0 5.05 3.41 9.76 8 10.91 4.59-1.15 8-5.86 8-10.91V5l-8-3zm-1.06 13.54L7.4 12l1.41-1.41 2.12 2.12 4.24-4.24 1.41 1.41-5.64 5.66z"/></svg>');
}

.player-tag[data-role="rifleman"]::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232c3e50"><path d="M20 10V8h-4V4h-2v4h-4V4H8v4H4v2h4v4H4v2h4v4h2v-4h4v4h2v-4h4v-2h-4v-4h4zm-6 4h-4v-4h4v4z"/></svg>');
}

.player-tag[data-role="medic"]::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23e74c3c"><path d="M19 3H5c-1.1 0-1.99.9-1.99 2L3 19c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-1 11h-4v4h-4v-4H6v-4h4V6h4v4h4v4z"/></svg>');
}

.player-tag[data-role="engineer"]::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%232c3e50"><path d="M18 15v4.5c0 .8-.7 1.5-1.5 1.5-.4 0-.8-.2-1.1-.4l-3.1-3.1-3.1 3.1c-.3.3-.7.4-1.1.4-.8 0-1.5-.7-1.5-1.5V15c0-.3.1-.7.4-1l3.1-3.1-3.1-3.1c-.3-.3-.4-.7-.4-1V4.5C7.5 3.7 8.2 3 9 3c.4 0 .8.1 1.1.4l3.1 3.1 3.1-3.1c.3-.3.7-.4 1.1-.4.8 0 1.5.7 1.5 1.5V9c0 .3-.1.7-.4 1l-3.1 3.1 3.1 3.1c.3.3.4.7.4 1z"/></svg>');
}

.player-tag[data-role="squadleader"] {
  background-color: #e3f2fd;
  border-color: #bbdefb;
}

.player-tag[data-role="rifleman"] {
  background-color: #f1f8e9;
  border-color: #dcedc8;
}

.player-tag[data-role="medic"] {
  background-color: #ffebee;
  border-color: #ffcdd2;
}

.player-tag[data-role="engineer"] {
  background-color: #fff8e1;
  border-color: #ffecb3;
}
